<template>
  <div class="outer">
    <h1>App</h1>
    <h2>{{list}}</h2>
    <List ref="listComp"/>
  </div>
</template>

<script>
import _ from 'lodash'
import List from './components/List.vue'
export default {
  name:"App",
  data(){
    return {
      list:[]
    }
  },
  components:{
    List
  },
  methods:{
    getListData(list){
      // this.list = [...list]
      this.list = _.cloneDeep(list)
      console.log(this.list[0] === list[0]);
    }
  },
  mounted(){
    this.$refs.listComp.$on('atguigu',this.getListData)
  }
}
</script>

<style>
.outer{
  height: 400px;
  background: red;
}
</style>